<template>
  <div class="home">
    <list-page-navigation>
      <div class="liebiao" style="margin-bottom: 2rem; padding:0;">
        <div style="position: relative;width: 100%;display: flex;margin-bottom: 0.5rem;" v-for="item in videos"
          :key="item.id">
          <img class="imgslt" style="margin-bottom: 0;" :src="item.cover" @click="handleClick(item)" />
          <!-- <div class="card_title">{{ item.coverTitle }}</div> -->
        </div>
      </div>
    </list-page-navigation>
  </div>
</template>
<style scoped src="../../public/css/styles.css"></style>
<style type="text/css">
.home {
  width: 100vw;
  height: 100vh;
  background: url(../assets/index_bj.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  background-size: 100% 100%;
  overflow: auto;
}

.liebiao img {
  width: 100%;
  object-fit: contain;
  margin-bottom: 0.5rem;
}

@media only screen and (min-width:640px) {
  .liebiao img {
    width: 100%;
    object-fit: contain;
    margin-bottom: 0.2rem;
  }
}
</style>
<script>
import ListPageNavigation from '@/components/ListPageNavigation.vue';
import { homeData2, baseUrlImg, clickCount } from '@/api/index.js'

export default {
  name: 'VideoTypeList',
  components: {
    ListPageNavigation,
  },
  data() {
    return {
      videos: []
    }
  },
  mounted() {
    this.getVideoData()
  },
  methods: {
    getVideoData() {
      let params = {
        pageNum: 1,
        pageSize: 10000
      }
      homeData2(params).then(res => {
        if (res.rows && res.rows.length > 0) {
          const dataList = res.rows
          dataList.map((item) => {
            if (item.cover) {
              item.cover = baseUrlImg + item.cover
            }
          })
          this.videos = dataList
        } else {
          this.videos = []
        }
      });
    },
    handleClick(item) {
      this.clickCountFunc(item.id)
      this.$router.push({
        name: 'videoList',
        params: item
      })
    },

    //点击统计
    clickCountFunc(typeld, typesubld) {
      let params = {
        type: 4,
        typeld
      }
      if (typesubld) {
        params['typesubld'] = typesubld
      }
      clickCount(params).then(res => {
      })
    }
  }
}
</script>